<template>
  <el-form :inline="true" :model="GetShowinfo" class="demo-form-inline">
    <el-form-item label="耳标">
      <el-input v-model="startQuery.EarTag" placeholder="请输入耳标" clearable />
    </el-form-item>
    <el-form-item label="耳标">
      <el-select v-model="startQuery.DeathType" placeholder="请选择" size="large" style="width: 240px">
        <el-option v-for="item in GetCauShow" :key="item.value" :label="item.name" :value="item.value" />
      </el-select>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="GetShow()">查询</el-button>
      <el-button type="danger" @click="DeleteRanges()">删除</el-button>
    </el-form-item>
  </el-form>
  <el-table :data="GetShowinfo" border style="width: 100%" @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55" />
    <el-table-column prop="deathDate" label="死亡时间" />
    <el-table-column prop="earTag" label="羊只耳号" />
    <el-table-column prop="deathType" label="死亡原因" v-slot="scope">
      <span v-if="scope.row.deathType == 1">腹泻</span>
      <span v-if="scope.row.deathType == 2">肺炎</span>
      <span v-if="scope.row.deathType == 3">产前瘫</span>
      <span v-if="scope.row.deathType == 4">产后瘫</span>
      <span v-if="scope.row.deathType == 5">酸中毒</span>
      <span v-if="scope.row.deathType == 6">应激猝死</span>
      <span v-if="scope.row.deathType == 7">梭卷</span>
      <span v-if="scope.row.deathType == 8">尿结石</span>
      <span v-if="scope.row.deathType == 9">发热</span>
      <span v-if="scope.row.deathType == 10">脱肛</span>
      <span v-if="scope.row.deathType == 11">黄疸</span>
      <span v-if="scope.row.deathType == 12">猝死</span>
    </el-table-column>
    <el-table-column prop="variety" label="品种" v-slot="scope">
      <span v-if="scope.row.variety == 1">杜泊</span>
      <span v-if="scope.row.variety == 2">澳洲白</span>
      <span v-if="scope.row.variety == 3">萨福克</span>
      <span v-if="scope.row.variety == 4">杜湖</span>
      <span v-if="scope.row.variety == 5">杜杜湖</span>
      <span v-if="scope.row.variety == 6">萨杜湖</span>
      <span v-if="scope.row.variety == 7">奥湖</span>
      <span v-if="scope.row.variety == 8">湖羊</span>
      <span v-if="scope.row.variety == 9">奥杜湖</span>
    </el-table-column>
    <el-table-column prop="sheepRescissionSex" label="性别" v-slot="scope">
      <span v-if="scope.row.sheepRescissionSex == true">公羊</span>
      <span v-if="scope.row.sheepRescissionSex == false">母羊</span>
    </el-table-column>

    <el-table-column prop="buildingManagementId" label="死亡栋舍" v-slot="scope">
      <span v-if="scope.row.buildingManagementId == 1">配种舍</span>
      <span v-if="scope.row.buildingManagementId == 2">后备舍</span>
      <span v-if="scope.row.buildingManagementId == 5">公羊舍</span>
      <span v-if="scope.row.buildingManagementId == 6">妊检舍</span>
      <span v-if="scope.row.buildingManagementId == 7">分娩舍</span>
      <span v-if="scope.row.buildingManagementId == 8">断奶舍</span>
      <span v-if="scope.row.buildingManagementId == 9">育肥舍</span>
      <span v-if="scope.row.buildingManagementId == 10">母羊舍</span>
      <span v-if="scope.row.buildingManagementId == 11">采购舍</span>
      <span v-if="scope.row.buildingManagementId == 12">后裔舍</span>
    </el-table-column>
    <el-table-column prop="columnManagementId" label="死亡栏位" v-slot="scope">
      <span v-if="scope.row.columnManagementId == 1">配种栏位1</span>
      <span v-if="scope.row.columnManagementId == 2">配种栏位2</span>
      <span v-if="scope.row.columnManagementId == 3">后备栏位1</span>
      <span v-if="scope.row.columnManagementId == 4">后备栏位2</span>
      <span v-if="scope.row.columnManagementId == 5">公羊栏位1</span>
      <span v-if="scope.row.columnManagementId == 6">公羊栏位2</span>
      <span v-if="scope.row.columnManagementId == 7">妊检栏位1</span>
      <span v-if="scope.row.columnManagementId == 8">妊检栏位2</span>
      <span v-if="scope.row.columnManagementId == 9">分娩栏位1</span>
      <span v-if="scope.row.columnManagementId == 10">妊检栏位2</span>
      <span v-if="scope.row.columnManagementId == 11">断奶栏位1</span>
      <span v-if="scope.row.columnManagementId == 12">断奶栏位2</span>
      <span v-if="scope.row.columnManagementId == 13">育肥栏位1</span>
      <span v-if="scope.row.columnManagementId == 14">育肥栏位2</span>
      <span v-if="scope.row.columnManagementId == 15">母羊栏位1</span>
      <span v-if="scope.row.columnManagementId == 16">母羊栏位2</span>
      <span v-if="scope.row.columnManagementId == 17">采购栏位1</span>
    </el-table-column>
    <el-table-column prop="birthDate" label="出生日期" />
    <el-table-column prop="createBy" label="创建人" />
    <el-table-column prop="createDate" label="创建时间" />
    <el-table-column prop="updateBy" label="修改人" />
    <el-table-column prop="updateDate" label="修改时间" />

    <el-table-column prop="" label="操作" width="180" v-slot="scope">
      <el-button type="primary" @click="Updates(scope.row.deathId)">编辑</el-button>
      <el-button type="danger" @click="Deletes(scope.row.deathId)">删除</el-button>
    </el-table-column>

  </el-table>
</template>

<script lang="ts" setup>

import { reactive, ref } from 'vue'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import starts from "@/api/SheepManagement/SheepIndex";

import DetathShow from "@/api/SheepManagement/SheepIndex";


import axios from "axios";
import { number } from "echarts";
import { useRouter, useRoute } from 'vue-router';
const Router = useRouter();

const Updates = (deathId) => {
  Router.push({
    path: "/SheepUpdate",
    query: {
      deathId: deathId
    }
  })
}


const DeletesRan = () => {

}
const GetCauShow = ref([])
const GetCaus = () => {
  starts.GetCause().then(res => {
    GetCauShow.value = res.data
  })
}


const Checkeds = ref();
const ids = ref([])
const handleSelectionChange = (val: []) => {
  Checkeds.value = val;
  Checkeds.value.forEach(item => {
    ids.value.push(item.deathId)
   
  })
};

const startQuery = reactive<DetathShow>({
  EarTag: "",
  DeathType: null,
  PageIndex: 1,
  PageSize: 10
});

const page = reactive({
  total: 0,
  totalPage: 0,
});


const GetShowinfo = ref([])
const GetShow = () => {
  starts.getList(startQuery).then((res: any) => {
    console.log(res.data.data)
    GetShowinfo.value = res.data.data,
      page.total = res.data.total,
      page.totalPage = res.data.totalPage
  })
}

const Deletes = (deathId: number) => {
  ElMessageBox.confirm(
    '您确定要删除吗',
    'Warning',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      starts.deleteDeath(deathId).then((res: any) => {
        if (res.data > 0) {
          ElMessage.success("删除成功")
          GetShow()
        }
        else {
          ElMessage.error("删除成功")
        }
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消删除',
      })
    })


}


const DeleteRanges = () => {
  if (ids.value.length == 0) {
    ElMessage({
      message: '请选择要删除的数据',
      type: 'warning',
    })
    return
  }
  ElMessageBox.confirm(
    '您确定要删除吗？',
    '删除',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      starts.DeathDeleteRan(ids.value).then((res: any) => {
        if (res.data > 0) {
          ElMessage.success("删除成功");
          GetShow();
        }
        else {
          ElMessage.error("删除失败");
        }
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消删除',
      })
    })

};



onMounted(() => {
  GetShow()
  GetCaus()
})



</script>